<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/html/js/axios.min.js"></script>
    <script src="/html/js/ajax.js"></script>
    <script>
        window.onload = function () {
            findByItem(1);
        }

        //动态条件查询
        async function findByItem(pageNo) {
            let param = {
                pageNo: pageNo,
                name:getObject("name").value,
                startDate: getObject("startDate").value,
                endDate: getObject("endDate").value
            };
            let info = await ajaxGet("/employee/findByItem", param);

            let str = "";
            for (let i = 0; i < info.list.length; i++) {
                let obj = info.list[i];
                str += `<tr><td>${obj.name}</td><td>${obj.birthday}</td><td>${obj.money}</td>
                      <td>${obj.deptBean.name}</td>
                      <td><a href="javascript:del(${obj.id})">删除</a>
                      <a href="/html/update.html?id=${obj.id}">修改</a>
                      </td></tr>`
            }
            console.log(str);
            getObject("date").innerHTML = str;

            let cutStr = "";
            for (let i = 1; i <= info.pages; i++) {
                cutStr += `<a style="margin-left: 10px"
            href="javascript:findByItem(${i})">${i}</a>`
            }
            getObject("cutPageDiv").innerHTML = cutStr;
        }

        async function del(id) {
            let info = await ajaxGet("/employee/del", {id});
            if (info == "ok") {
                findByItem(1);
            } else {
                alert("删除失败")
            }
        }
    </script>
</head>
<body>
<table border="1" cellpadding="0" width="60%">
    <thead>
    <tr>
        <th>姓名</th>
        <th>生日</th>
        <th>工资</th>
        <th>部门</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody id="date">
    </tbody>
</table>
<div id="cutPageDiv"></div>
<div>
    <a href="/html/add.html">添加</a>
</div>
<div>
    姓名:<input type="text" id="name"><br>
    起始日期:<input type="text" id="startDate"><br>
    结束日期:<input type="text" id="endDate"><br>
    <input type="button" onclick="findByItem(1)" value="查询">
</div>
</body>
</html>